<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>练习</title>
</head>
<body>
<ul>
  <li>广州恒大</li>
  <li>北京国安</li>
  <li>山东鲁能</li>
  <li>江苏绿城</li>
</ul>
<a href="https://www.baidu.com">跳转到百度</a>
<script>
    var list=document.getElementsByTagName('li');
    for (var i = 0; i < list.length; i++) {
        var li =list[i]
        li.className='a'
    }
    var ul=document.getElementsByTagName('ul')[0]
    console.log(ul.children)//所有孩子 数组类型 显示4个子节点
    console.log(ul.childNodes) //9个子节点 包含4个孩子节点和5个换行符
    console.log(ul.firstChild) //结果是一个文本节点 获取每个子节点都会包含文本节点
    console.log(ul.childNodes[2])  //获取第三个节点 是一个换行符 文本节点
    console.log(ul.parentNode) //向上查找ul的父节点body
    console.log(ul.nextElementSibling) //找自己下一个兄弟节点 带Element的都会忽略文本
    console.log(ul.nextSibling) // 兄弟节点是一个文本
    console.log(ul.previousElementSibling) //找上一个兄弟节点 不包含文本
    console.log(ul.previousSibling) //是一个文本
</script>
</body>
</html>
